<template>


    <div style="display: flex;flex-direction: column" >


      <div style="width: 100%;height: 60px;border: 0px blue solid;">

      <!--    顶部按钮栏    -->
        <header class="top-bar">
          
          <div style="width: 300px;border-left: 0;border-right: 0" class="awsCenterLayout">
            <img style="width: 80px;" src="../../src/assets/log.png">
            <el-text size="large" style="font-size: 23px;font-weight: bold">心理咨询预约平台</el-text>
          </div>

        <!--   按钮们       -->
          <div style="display: flex;flex-direction: row;margin-right: 30%;width: 500px">
            <router-link to="/layout/main" style="text-decoration: none;color: #696969">
              <div style="border: 0px black solid; height: 60px; width: 80px; padding: 10px;" class="awsCenterLayout">
                <text>首页</text>
              </div>
            </router-link>

            <router-link v-if="userStore.user.usertype=='client'" to="/layout/hall" style="text-decoration: none;color: #696969">
              <div style="border: 0px black solid; height: 60px; width: 100px; padding: 10px" class="awsCenterLayout">
                <text>咨询大厅</text>
              </div>
            </router-link>

            <router-link v-if="userStore.user.usertype=='client'" to="/layout/myRecord" style="text-decoration: none;color: #696969">
              <div style="border: 0px black solid; height: 60px; width: 100px; padding: 10px" class="awsCenterLayout">
                <text>咨询记录</text>
              </div>
            </router-link>

            <router-link v-if="userStore.user.usertype=='counselor'" to="/layout/record" style="text-decoration: none;color: #696969" @click.native="handleNavigation() ">
              <div style="border: 0px black solid; height: 60px; width: 100px; padding: 10px" class="awsCenterLayout">
                <text>预约记录</text>
              </div>
            </router-link>

            <router-link v-if="userStore.user.usertype=='counselor'&&isOnTargetPage" style="text-decoration: none;color: #696969"  @click.native="handleNavigation()">
              <div style="border: 0px black solid; height: 60px; width: 100px; padding: 10px" class="awsCenterLayout">
                <text style="color:#4e3c30;">我的反馈</text>
              </div>
            </router-link>
          </div>

          <nav class="navigation">
            <div style="display: flex;">
              <img v-if="!avatar && (userData.gender === '男' || !userData.gender)"
                   style="width: 70px;"
                   src="../assets/boy.png">
              <img v-else-if="!avatar && userData.gender === '女'"
                   style="width: 70px;"
                   src="../assets/girl.png">
              <img v-else
                   style="width: 50px; height: 50px; clip-path: circle(50%); object-fit: cover; margin-right: 10px"
                   :src="avatar">
              <div style="border: 0px blue solid;" class="awsCenter">
                <el-dropdown trigger="click">
                  <div class="el-dropdown-link">
                    {{userData.realname?userData.realname:'用户'+userData.username}}<el-icon class="el-icon--right"><arrow-down /></el-icon>
                  </div>
                  <template #dropdown>
                    <el-dropdown-menu>
                      <router-link style="text-decoration: none;" to="/layout/personal">
                      <el-dropdown-item>
                          <text>个人中心</text>
                      </el-dropdown-item>
                      </router-link>
                      <el-dropdown-item @click="logOut">
                        退出登录
                      </el-dropdown-item>
                    </el-dropdown-menu>
                  </template>
                </el-dropdown>
              </div>
          </div>

          </nav>
        </header>
      </div>



      <router-view></router-view> <!-- 渲染子路由 -->





      <el-dialog
          v-model="showWriteInfo"
          style="height: 670px"
          :title="submitTitle"
          width="850"
          align-center
          :close-on-click-modal="false"
          :show-close="showSubmitClose"
      >
        <el-form style="height: 440px;overflow: auto;" :model="counselorForm" label-position="top" label-width="100px">

          <!--    个人信息      -->
          <div v-if="active==1">
            <div style="display: flex;flex-direction: row">
              <div>
                <el-form-item prop="nickname" label-position="top" label="昵称">
                  <el-input :disabled="isDisabled" style="width: 200px" placeholder="请输入" v-model="userForm.nickname"></el-input>
                </el-form-item>

                <el-form-item prop="realname" label-position="top" label="姓名">
                  <el-input :disabled="isDisabled" style="width: 200px" placeholder="请输入" v-model="userForm.realname"></el-input>
                </el-form-item>
                <el-form-item prop="gender" label-position="top" label="性别">
                  <el-radio-group :disabled="isDisabled" v-model="userForm.gender">
                    <el-radio value="男">男</el-radio>
                    <el-radio value="女">女</el-radio>
                  </el-radio-group>
                </el-form-item>
                <el-form-item  prop="phone" label-position="top" label="电话">
                  <el-input :disabled="isDisabled" style="width: 200px" placeholder="请输入" v-model="userForm.phone"></el-input>
                </el-form-item>
              </div>
              <div style="margin-left: 250px">
                <el-form-item  label-position="top" label="头像">
                  <el-upload
                      class="avatar-uploader"
                      :action="UploadUrl()"
                      :show-file-list="false"
                      accept=".jpg,.png"
                      @change="onFileChange"
                      :before-upload="beforeAvatarUpload"
                      :http-request="uploadHttpRequest"
                      :disabled="isDisabled"
                  >
                    <img style="height: 110px" v-if="imageUrl" :src="imageUrl" class="avatar" />
                    <el-icon v-else class="avatar-uploader-icon"><Plus /></el-icon>
                  </el-upload>
                </el-form-item>
                <el-form-item label="出生年月">
                  <el-date-picker :disabled="isDisabled"
                                  v-model="userForm.birthday"
                                  type="date"
                                  placeholder="选择日期"
                  >
                  </el-date-picker>
                </el-form-item>
                <el-form-item label="邮箱">
                  <el-input :disabled="isDisabled" style="width: 220px" v-model="userForm.email"></el-input>
                </el-form-item>

              </div>
            </div>
            <el-form-item label="地址" >
              <el-input :disabled="isDisabled" type="textarea" style="width: 400px" v-model="userForm.address"></el-input>
            </el-form-item>
          </div>

          <!--    咨询师信息      -->
          <div v-if="active==2">
            <el-form-item style="margin-top: 50px" prop="specialty" label-position="top" label="选择专业领域">
              <el-select :disabled="isDisabled" v-model="counselorForm.specialty" placeholder="请选择" style="width: 240px">
                <el-option
                    v-for="item in specialtyList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                />
              </el-select>
            </el-form-item>

            <el-form-item prop="bio" label-position="top" label="个人简介">
              <el-input :disabled="isDisabled" v-model="counselorForm.bio" placeholder="请输入" style="width: 800px"
                        :rows="8"
                        type="textarea" >

              </el-input>
            </el-form-item>
          </div>

          <!--    工作时间      -->
          <div v-if="active==3">
            <div style="width: 100%;display: flex">
              <el-button :disabled="isDisabled" style="margin-left: auto" @click="addRow" plain type="primary">增行</el-button>
            </div>
            <!--工作时间表格-->
            <el-table :data="timeRows" style="width: 100%;height: 400px;overflow-y: auto;">
              <!--咨询室选择-->
              <el-table-column width="180" label="咨询室">
                <template v-slot="{ row }">
                  <el-select :disabled="isDisabled" v-model="row.room" placeholder="请选择" style="width: 150px">
                    <el-option
                        v-for="item in roomList"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                    />
                  </el-select>
                </template>
              </el-table-column>
              <!--工作日选择-->
              <el-table-column width="180" label="工作日">
                <template v-slot="{ row }">
                  <el-select :disabled="isDisabled" v-model="row.weekend" placeholder="请选择" style="width: 150px">
                    <el-option
                        v-for="item in weekendList"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                    />
                  </el-select>
                </template>
              </el-table-column>
              <el-table-column width="300" label="工作时间">
                <template v-slot="{ row }">
                  <div style="display: flex;flex-direction: row">
                    <div>
                      <el-time-select :disabled="isDisabled"
                                      format="HH:mm:ss"
                                      v-model="row.starttime"
                                      style="width: 130px"
                                      :max-time="row.endtime"
                                      class="mr-4"
                                      placeholder="开始时间"
                                      start="08:30"
                                      step="00:15"
                                      end="18:30"
                      />
                    </div>
                    <div style="margin-left: 10px">
                      <el-time-select :disabled="isDisabled"
                                      format="HH:mm:ss"
                                      v-model="row.endtime"
                                      style="width: 130px"
                                      :min-time="row.starttime"
                                      placeholder="结束时间"
                                      start="08:30"
                                      step="00:15"
                                      end="18:30"
                      />
                    </div>
                  </div>

                </template>
              </el-table-column>
              <el-table-column label="操作">
                <template v-slot="{ row, $index }">
                  <el-button :disabled="isDisabled"  type="danger" circle plain :icon="Delete" @click="deleteRow($index)"></el-button>
                </template>
              </el-table-column>
            </el-table>
          </div>

          <!--    提交成功展示画面      -->
          <div v-if="active==4" class="awsCenter" style="margin-top: 80px">
            <img style="height: 300px" src="../assets/submitSuccess.png">
          </div>



        <!--显示当前进度并提供步骤间的导航指示-->
        </el-form>
        <el-steps style="max-width: 600px;margin-left: 14%;margin-top: 20px" :active="active" >
          <el-step title="个人信息" />
          <el-step title="咨询师信息" />
          <el-step title="工作时间" />
        </el-steps>

        <!--   按钮栏目     -->
        <div v-if="isShowButton" style="border-top: 1px solid #D3D3D3;margin-top: 30px">
          <div style="margin-top: 12px;margin-bottom: 10px;display: flex;flex-direction: row;margin-left: 65%">
            <el-button  @click="prev">上一步</el-button>
            <el-button  @click="next">下一步</el-button>
            <el-button v-if="active==3" type="primary" plain @click="flag?submitForm():updateForm()">提 交</el-button>
          </div>

        </div>

      </el-dialog>



    </div>








</template>

<script setup lang="ts">
import {
  ArrowDown, Delete, Plus,
} from '@element-plus/icons-vue'
import {conSuccessService, getCouIdService, getUserService} from "@/api/user.js";
import {computed, h, onMounted, onUnmounted, ref, watch} from "vue";
import {useUserStore} from "@/stores/user/user.js";
import {useRoute, useRouter} from "vue-router";
import {ElMessage, ElNotification} from "element-plus";
import {clientCheckService,conCheckService} from '@/api/task.js'
const userStore=useUserStore()
const router = useRouter()
const route = useRoute();

// 定义响应式变量来存储计数器
const count1 = ref(0);
const count2 = ref(0);

// 用于存储定时器ID
let c1: number | undefined;
let c2: number | undefined;

// 咨询师检查是否有预约
const conCheck=( ()=>{
  count1.value=0;
  c1 = setInterval(async () => {
    try {
      // 每隔5秒增加第一个计数器并发送GET请求
      count1.value++;

      const response = await conCheckService(userStore.user.counselorid);
      if (response.code===200){
        if (response.data&&count1.value===1){

          //弹出弹框
          ElNotification({
            title: '通知',
            type: 'warning',
            dangerouslyUseHTMLString: true,
            message: `<div style=display: flex;flex-direction: column;width: 230px">
                        <div >您有来访者预约了，请及时查看&nbsp;:&nbsp; </div>
                        <div style="width: 230px">
                             <span style="text-decoration: underline; font-style: italic;" id="checkClient">点击查看</span>
                        </div></div>`, // 使用模板字符串插入text变量
            duration: 0
          });
          document.getElementById('checkClient').addEventListener('click', gotoAppoint);
          //clearInterval(c1)
        }
      }
    } catch (error) {
      console.error('请求失败:', error);
      // 可以在这里添加错误处理逻辑，比如重试机制或者停止定时器
    }



  }, 1000); // 5000毫秒 = 5秒
})

// 来访者检查是否完成
const clientCheck=(()=> {
  count2.value=0
  c2 = setInterval(async () => {
    // 每隔10秒增加第二个计数器
    try {
      // 每隔5秒增加第一个计数器并发送GET请求
      count2.value++;

      const response = await clientCheckService(userStore.user.userid);
      if (response.code===200){
        if (response.data&&count2.value===1){

          //弹出弹框
          ElNotification({
            title: '通知',
            type: 'warning',
            dangerouslyUseHTMLString: true,
            message: `<div style=display: flex;flex-direction: column;width: 230px">
                        <div >您的预约已完成，请及时填写反馈&nbsp;:&nbsp; </div>
                        <div style="width: 230px">
                             <span style="text-decoration: underline; font-style: italic;" id="checkClient">点击查看</span>
                        </div></div>`, // 使用模板字符串插入text变量
            duration: 0
          });
          document.getElementById('checkClient').addEventListener('click', gotoFeedback);

          //clearInterval(c2)
        }
      }
    } catch (error) {
      console.error('请求失败:', error);
      // 可以在这里添加错误处理逻辑，比如重试机制或者停止定时器
    }


  }, 1000); // 10000毫秒 = 10秒

})




const isOnTargetPage = computed(() => {
  return route.path === '/layout/feedback'; // 替换为你的目标页面路径
});

watch(
    () => userStore.user,
    (newUser, oldUser) => {
      console.log('user变化了:', newUser);
      getUser()
      // 在这里可以添加其他逻辑，比如发起 API 请求等
    }
)


const userData=ref({})
const getUser=(async ()=>{
  const res=await getUserService()
  if(res.data!=null){
    //页面渲染
    userData.value=res.data
    avatar.value=res.data.avatar
  }

  //获取咨询师id
  if (userData.value.usertype!='client'){
    const getCouIdRes=await getCouIdService(userData.value.userid)
    if (getCouIdRes.code===200){
      userData.value.counselorid=getCouIdRes.data
    }
  }


})
//获取当前用户信息
import {filedService, getNoteService, updateFiledService, updateService} from '@/api/filed.js'
import {getAllRecordService, getAppByUserIdService} from "@/api/appointment.js"

const avatar=ref('')
onMounted(  async () => {



  await getUser()
  userStore.setUser(userData.value)



  //判断当前是咨询师还是来访者
  if (userStore.user.usertype=='client'){
    //来访者
    //clientCheck();


  }else {
    conCheck();


    status.value=userStore.user.status
    //页面挂载时判断咨询师是否审核
    console.log(status.value)
    if (status.value==0){
      //如果没有提交
      showWriteInfo.value=true
      isShowButton.value=true
      submitTitle.value='完善信息'
      counselorForm.value.username=userStore.user.username
      showSubmitClose.value=false
      isDisabled.value=false

    }else if (status.value==2){
      //提交了但是没审核
      active.value=4
      showSubmitClose.value=true
    }else if (status.value==3){
      //被拒绝
      active.value=1
      showSubmitClose.value=true
      //弹出通知 获取被拒绝的理由
      //根据当前账号查询审批单
      let text=''
      let res=await getNoteService(userStore.user.username)
      if (res.code===200){
        text=res.message
      }
      text=text?text:''

      //弹出
      ElNotification({
        title: '通知',
        type: 'warning',
        dangerouslyUseHTMLString: true,
        message: `<div style=display: flex;flex-direction: column;width: 230px">
                        <div >您的申请未通过&nbsp;:&nbsp; </div>
                        <div style="width: 230px"><text style="color: #ee7752;">${text}</text></div>
                        <div style="width: 230px">
                             <span style="margin-left: 70%; text-decoration: underline; font-style: italic;" id="checkLink">点击修改</span>
                        </div></div>`, // 使用模板字符串插入text变量
        duration: 0
      });
      document.getElementById('checkLink').addEventListener('click', gotoCheck);
      //设置flag标志是修改还是新增
      flag.value=false
    }else {
      //审核通过 弹出通知 只弹出一次
      const res=await conSuccessService()
      if (res.code===200){
        console.log(res)
        if (res.data){
          //弹出
          ElNotification({
            title: '通知',
            message: h('i', { style: 'color: teal' }, '您的申请已通过，成功入驻'),
            duration: 5000,
            type:'success'
          })
        }
      }

      /*//获取当前咨询师的预约记录
      let getCouRes=await getAllRecordService(parseInt(userStore.user.userid))
      if (getCouRes.code===200){
        console.log(getCouRes.data)
          if (getCouRes.data){
            //弹出提示并且导航到预约界面
            ElNotification({
              title: '通知',
              type: 'warning',
              dangerouslyUseHTMLString: true,
              message: `<div style=display: flex;flex-direction: column;width: 230px">
                        <div >您有来访者预约了，请及时查看&nbsp;:&nbsp; </div>
                        <div style="width: 230px">
                             <span style="text-decoration: underline; font-style: italic;" id="checkClient">点击查看</span>
                        </div></div>`, // 使用模板字符串插入text变量
              duration: 0
            });
            document.getElementById('checkClient').addEventListener('click', gotoAppoint);

          }
      }*/

    }


  }


//加载咨询室数据
  let resRoom=await getRoom()
  if (resRoom.code===200){
    resRoom.data.forEach(item=>{
      roomList.push({
        value: item.room,
        label: item.room,
      })
    })
  }




});


onUnmounted(()=>{
  if (c1 !== undefined) clearInterval(c1);
  if (c2 !== undefined) clearInterval(c2);
})
//true是新增 false是修改
const flag=ref(true)

const gotoAppoint=(()=>{
  clearInterval(c1)
  clearInterval(c2)
  router.push("/layout/record")
})

const gotoFeedback=(()=>{
  clearInterval(c1)
  clearInterval(c2)
  router.push("/layout/myRecord")
})


//申请未通过后点击修改
const gotoCheck=(async ()=>{
  // 在这里编写点击链接后要执行的操作
  showWriteInfo.value=true
  isShowButton.value=true
  submitTitle.value='修改信息'

  //信息回写
  //根据当前用户查
  const userRes=await getUserService()
  if (userRes.code===200){
    console.log(userRes.data)
    userForm.value={...userRes.data}

    //根据账号查咨询师信息
    const conRes=await getByUserIdService(userRes.data.userid)
    delForm.value.push(conRes.data)
    if (conRes.code===200){
      counselorForm.value={...conRes.data}
      timeRows.value=conRes.data.counselorscheduleList
      timeRows.value.forEach(item=>{
        item.starttime= item.starttime.split(' ')[3]
        item.endtime=item.endtime.split(' ')[3]
      })
    }
  }

})


const logOut=(()=>{
  clearInterval(c1)
  clearInterval(c2)
  ElMessage.success("退出登录")
  userStore.logout()
  router.push('/')
})

const iconRef = ref<HTMLElement | null>(null);

const handleMouseOver = () => {
  if (iconRef.value) {
    iconRef.value.style.transform = 'scale(1.2)';
    iconRef.value.style.color = '\t#C0C0C0';
  }
};

const handleMouseLeave = () => {
  if (iconRef.value) {
    iconRef.value.style.transform = 'scale(1)';
    iconRef.value.style.color = 'gray';
  };
};
//######################################################################################
import moment, {duration} from "moment/moment";

import {getRoom} from '@/api/room.js'

const showWriteInfo = ref(false)
const active = ref(1)

const next = () => {
  if (active.value < 3) {
    active.value++
  } else {
    active.value = 3
  }
}

const prev = () => {
  if (active.value > 1) {
    active.value--
  } else {
    active.value = 1
  }
}

//完善信息表单数据
//表单数据
const counselorForm=ref({
  username:'',
  specialty:'',
  bio:'',
  status:'0',
  counselorscheduleList:[]
})

const userForm=ref({
  nickname:'',
  realname:'',
  gender:'',
  avatar:'',
  email:'',
  phone:'',
  birthday:null,
  address:'',
  status:'2'
})

const weekendList = ref([
  {
    label: '星期一',
    value: '1'
  },
  {
    label: '星期二',
    value: '2'
  },
  {
    label: '星期三',
    value: '3'
  },
  {
    label: '星期四',
    value: '4'
  },
  {
    label: '星期五',
    value: '5'
  }
])

const timeRows = ref([
]);

const addRow = () => {
  timeRows.value.push({
    room: '',
    weekend: '',
    starttime: null,
    endtime:null
  });
};

const deleteRow = (index: number) => {
  timeRows.value.splice(index, 1);
};

const specialtyList=[
  {
    value: '心理健康',
    label: '心理健康',
  },
  {
    value: '婚姻和家庭',
    label: '婚姻和家庭',
  },{
    value: '职业发展',
    label: '职业发展',
  },
  {
    value: '教育和学术',
    label: '教育和学术',
  },
  {
    value: '健康和营养',
    label: '健康和营养',
  }
]
const roomList=[]

const isShowButton=ref(false)

const status=ref('0')
const isDisabled=ref(false)
const submitTitle=ref('')

const showSubmitClose=ref(false)

import {ElMessage, type UploadProps} from 'element-plus'
import {upload} from '@/api/upload.js'
import { userRegisterService, userUpdate} from "@/api/user.js";
import {delCounselorService, getByUserIdService, saveCounselorService, upCounselorService} from "@/api/counselor.js";
import {isPrototypeOf} from "node";

const imageUrl = ref('')


const beforeAvatarUpload: UploadProps['beforeUpload'] = (rawFile) => {
  if (rawFile.size / 1024 / 1024 > 2) {
    ElMessage.error('头像大小不能超过2MB')
    return false
  }
  return true
}

const UploadUrl = () => {
  // 因为action参数是必填项，我们使用二次确认进行文件上传时，直接填上传文件的url会因为没有参数导致api报404，
  // 所以这里将action设置为一个返回为空的方法就行，避免抛错
  return ""
}

const uploadHttpRequest=((data)=>{

})

const onFileChange=(async (file)=>{
  console.log(file)
  imageUrl.value = URL.createObjectURL(file.raw!)
  const res=await upload(file.raw)
  console.log(res)
  if (res.code===200){
    userForm.value.avatar=res.message
  }
})

//提交申请
const submitForm=(async ()=>{
  userForm.value.status='2'
  console.log("用户信息表单数据")
  console.log(userForm.value)
  if (timeRows.value.length==0){
    ElMessage.warning("未填写工作时间")
  }else{
    if (checkTimes()){
      counselorForm.value.username=userStore.user.username
      counselorForm.value.counselorscheduleList=timeRows.value

      ////时间转换
      for (let i = 0; i < counselorForm.value.counselorscheduleList.length; i++) {
        counselorForm.value.counselorscheduleList[i].starttime=convertStringToTime(timeRows.value[i].starttime)
        counselorForm.value.counselorscheduleList[i].endtime=convertStringToTime(timeRows.value[i].endtime)
      }

      console.log("咨询师信息")
      console.log(counselorForm.value)
      //console.log(convertStringToTime(counselorForm.value.counselorscheduleList[0].starttime.toString()))

      //修改当前id下的用户数据
      const userRes= await filedService(userForm.value)
      if (userRes.code===200){

        //插入咨询师数据
        const conRes=await saveCounselorService(counselorForm.value)
        if (conRes.code===200){
          active.value=4
          //重新加载用户数据
          const res=await getUserService()
          if (res.code===200){
            ElMessage.success("提交成功")
            userStore.setUser(res.data)
          }
          status.value=userStore.user.status
          isShowButton.value=false
          submitTitle.value=''
          showSubmitClose.value=true
        }
        else {
          timeRows.value.forEach(item=>{
            item.endtime=item.endtime.toString().split(' ')[4]
            item.starttime=item.starttime.toString().split(' ')[4]
          })
          ElMessage.warning(conRes.errMsg)
        }

      }else {
        console.log(timeRows.value)
        timeRows.value.forEach(item=>{
          item.endtime=item.endtime.toString().split(' ')[4]
          item.starttime=item.starttime.toString().split(' ')[4]
        })
        ElMessage.warning(userRes.errMsg)
      }


    }
  }



})

//要先删除的信息表单
const delForm=ref([])

//修改申请
const updateForm=(async ()=>{
  userForm.value.status='2'
  console.log("用户信息表单数据")
  console.log(userForm.value)
  if (timeRows.value.length==0){
    ElMessage.warning("未填写工作时间")
  }else{
    if (checkTimes()){
      counselorForm.value.username=userStore.user.username
      counselorForm.value.counselorscheduleList=timeRows.value

      ////时间转换
      for (let i = 0; i < counselorForm.value.counselorscheduleList.length; i++) {
        counselorForm.value.counselorscheduleList[i].starttime=convertStringToTime(timeRows.value[i].starttime)
        counselorForm.value.counselorscheduleList[i].endtime=convertStringToTime(timeRows.value[i].endtime)
      }

      counselorForm.counselorId=counselorForm.counselorid
      console.log("咨询师信息")
      console.log(counselorForm.value)

      //修改当前id下的用户数据
      const userRes= await updateFiledService(userForm.value)
      if (userRes.code===200){

        //先删除咨询师数据

/*        const delRes= await delCounselorService(delForm.value)
        if (delRes.code===200){*/
          //修改咨询师数据
          const conRes=await upCounselorService(counselorForm.value)
          if (conRes.code===200){
            active.value=4
            //重新加载用户数据
            const res=await getUserService()
            if (res.code===200){
              ElMessage.success("提交成功")
              userStore.setUser(res.data)
            }
            status.value=userStore.user.status
            isShowButton.value=false
            submitTitle.value=''
            showSubmitClose.value=true
          }else {
            timeRows.value.forEach(item=>{
              item.endtime=item.endtime.toString().split(' ')[4]
              item.starttime=item.starttime.toString().split(' ')[4]
            })
            ElMessage.warning(conRes.errMsg)
          }
/*        }else {
          timeRows.value.forEach(item=>{
            item.endtime=item.endtime.toString().split(' ')[4]
            item.starttime=item.starttime.toString().split(' ')[4]
          })
          ElMessage.warning(delRes.errMsg)
        }*/

      }else {
        timeRows.value.forEach(item=>{
          item.endtime=item.endtime.toString().split(' ')[4]
          item.starttime=item.starttime.toString().split(' ')[4]
        })
        ElMessage.warning(userRes.errMsg)
      }


    }
  }
})


const checkTimes=(()=>{

  for(let i = 0; i < timeRows.value.length;i++) {
    if (!timeRows.value[i].room||!timeRows.value[i].weekend||!timeRows.value[i].starttime||!timeRows.value[i].endtime){
      ElMessage.warning("工作时间未填写完整")
      return false;
    }
  }
  return true;
})
//时间转换
function convertStringToTime(timeString) {
  // 获取当前日期
  const currentDate = moment().format('ddd MMM DD YYYY');

  // 合并日期和时间字符串
  const dateTimeString = `${currentDate} ${timeString} GMT+0800 (中国标准时间)`;

  // 使用 moment.js 将日期时间字符串转换为 Date 对象
  const dateObject = moment(dateTimeString, "ddd MMM DD YYYY HH:mm:ss [GMT]Z (z)").toDate();

  return dateObject;
}








//跳转前校验
const handleNavigation=(async ()=>{

    console.log(status.value)
    if (status.value==0){
      //如果没有提交
      await router.push("/layout/main")
      ElMessage.info("请先完善信息")
      showWriteInfo.value=true
      isShowButton.value=true
      submitTitle.value='完善信息'
      counselorForm.value.username=userStore.user.username
      showSubmitClose.value=false
      isDisabled.value=false


    }else if (status.value==2){
      //提交了但是没审核
      await router.push("/layout/main")
      console.log("提交了但是没审核")
      ElMessage.info("请等待审核")
      showWriteInfo.value=true
      active.value=4
    }else if (status.value==3){
      //被拒绝
      await router.push("/layout/main")
      active.value=1
      //弹出通知 获取被拒绝的理由
      //根据当前账号查询审批单
      let text=''
      let res=await getNoteService(userStore.user.username)
      if (res.code===200){
        text=res.message
      }
      text=text?text:''

      //弹出
      ElNotification({
        title: '通知',
        type: 'warning',
        dangerouslyUseHTMLString: true,
        message: `<div style=display: flex;flex-direction: column;width: 230px">
                        <div >您的申请未通过&nbsp;:&nbsp; </div>
                        <div style="width: 230px"><text style="color: #ee7752;">${text}</text></div>
                        <div style="width: 230px">
                             <span style="margin-left: 70%; text-decoration: underline; font-style: italic;" id="checkLink">点击修改</span>
                        </div></div>`, // 使用模板字符串插入text变量
        duration: 0
      });
      document.getElementById('checkLink').addEventListener('click', gotoCheck);
      //设置flag标志是修改还是新增
      flag.value=false

      await gotoCheck()
    }

})
</script>

<style lang="scss">



body{
  overflow-y: scroll;
}

.top-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 15px 30px;
  border-bottom: #C0C0C0 2px solid;
  background-color: #F5F5F5;
  height: 62px;
}

.logo {
  font-size: 24px;
  font-weight: bold;
}

.navigation {
  display: flex;
  gap: 20px;
}


.nav-item:hover {
  color: #FFFFFF; /* 悬停时链接颜色变化为白色 */
}

/* 样式应用于所有包含文本的div */
.awsCenterLayout {
  display: flex;
  justify-content: center;
  align-items: center;
  transition: background-color 0.3s ease, color 0.3s ease; /* 仅平滑过渡背景色和文字颜色 */
  border: 1px black solid; /* 确保边框样式保持一致 */
  //background-color: #E6E6FA;
}

/* 鼠标悬停时的背景颜色变化 */
.awsCenterLayout:hover {
  background-color: #DCDCDC; /* 轻微的颜色变化，可以根据喜好调整 */
  cursor: pointer; /* 改变鼠标指针为手型，提示可点击 */
}

/* 点击时的背景颜色变化 */
/*.awsCenterLayout:active {
  background-color: #a7a5a6; !* 更深一点的颜色变化，表示被点击状态 *!
}*/

/* 可选：如果你想在悬停时也改变文字颜色 */
.awsCenterLayout:hover {
  color: #a8acb7; /* 改变文字颜色为蓝色（或者任何你想要的颜色） */
}

/* 去掉router-link默认的下划线 */
.awsCenterLayout a {
  text-decoration: none;
}

/* 确保悬停、点击时没有下划线 */
.awsCenterLayout a:hover,
.awsCenterLayout a:active {
  text-decoration: none;
}

//@import "compass/css3";

*, :before, :after{ box-sizing: border-box; }
// FONTS
$sans: 'Source Sans Pro', Helvetica, Arial, sans-serif;

// COLORS
$orange: #DF4500;
$gray: #35302D;
$gray-shine: #3C3735;
$white-off: #DFDBD9;

// REUSABLE STYLES
.unstyled{ list-style: none; padding: 0; margin: 0;
  a{ text-decoration: none; }
}
.list-inline{ overflow: hidden;
  li{ float: left; }
}

// HEADER STYLES
.header{
  position: fixed;
  left: 0; top: 0; bottom: 0;
  width: 17.5em;
  background: $gray;
}

.logo{
  text-transform: lowercase;
  font: 300 2em $sans;
  text-align: center;
  padding: 0; margin: 0;

  a{
    display: block;
    padding: 1em 0;
    color: $white-off;
    text-decoration: none;
    transition: .15s linear color;

    &:hover{
      color: #fff;
      span{ color: $orange; }
    }
  }

  span{
    font-weight: 700;
    transition: .15s linear color;
  }
}

// MAIN NAV
.main-nav{

  ul{
    border-top: solid 1px $gray-shine;
  }

  li{
    border-bottom: solid 1px $gray-shine;
  }

  a{
    padding: 1.1em 0;
    color: $white-off;
    font: 400 1.125em $sans;
    text:{
      align: center;
      transform: lowercase;
    }

  &:hover{
      color: #fff;
    }
  }
}

// SOCIAL LINKS
.social-links{
  border-bottom: solid 1px $gray-shine;

  li{
    width: 25%;
    border-left: solid 1px $gray-shine;
    &:first-child{ border: none; }
  }

  a{
    display: block;
    height: 5.5em;
    text-align: center;
    color: $gray-shine;
    font: 0.75em/5.5em $sans;
    &:hover{
      color: $white-off;
    }
  }
}

// HOVER SLIDE EFFECT
.list-hover-slide{

  li{
    position: relative;
    overflow: hidden;
  }

  a{
    display: block;
    position: relative;
    z-index: 1;
    transition: .35s ease color;

    &:before{
      content: '';
      display: block;
      z-index: -1;
      position: absolute;
      left: -100%; top: 0;
      width: 100%; height: 100%;
      border-right: solid 5px $orange;
      background: $gray-shine;
      transition: .35s ease left;
    }

    &.is-current,
    &:hover{

      &:before{
        left: 0;
      }
    }
  }
}
</style>